<<<<<<< HEAD
<template>
    <div>
        <el-input style="width: 150px;margin-left: 0px;margin-right: 20px;" placeholder="请输入单据编号或备注" v-model="changeNum"
            clearable>
        </el-input>
        <span class="demonstration">日期：</span>
        <el-date-picker v-model="value2" type="daterange" align="right" unlink-panels range-separator="至"
            start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions"
            style="width: 200px;margin-right: 20px;">
        </el-date-picker>

        付款账户：
        <el-select v-model="accountOutId" placeholder="付款账户" style="width: 100px;margin-right: 20px;">
            <el-option>
                全部
            </el-option>
            <el-option v-for="item in accounts" :key="item.accountId" :label="item.accountName" :value="item.accountId">

            </el-option>
        </el-select>
        收款账户：
        <el-select v-model="accountInId" placeholder="收款账户" style="width: 100px;margin-right: 20px;">
            <el-option>
                全部
            </el-option>
            <el-option v-for="item in accounts" :key="item.accountId" :label="item.accountName" :value="item.accountId">
            </el-option>
        </el-select>
        <el-button type="" style="margin-left: 20px;float: right;" @click="searchByPage(1, 5)">查询</el-button>
        <div style="clear: both;"></div>


        <hr style="margin-top: 10px">

        <div style="float: right;clear: both;margin-top: 10px">
            <el-button type="primary">新增</el-button>
            <el-button type="primary">审核</el-button>
            <el-button type="primary">导出</el-button>
            <el-button type="primary">删除</el-button>
        </div>
        <br>
        <div style="clear: both;"></div>
        <el-table height="300px" :data="pageInfo.list" border style="width: 100%; font-size: 13px;margin-top: 10px;">
            <el-table-column type="selection" width="55">
            </el-table-column>
            <el-table-column fixed prop="date" label="操作" width="150">

                <template slot-scope="scope">
                    <el-button @click="handleClick(scope.row.id)" type="text" size="small">删除</el-button>
                    <el-button @click="updateType(scope.row.id)" type="text" size="small">编辑</el-button>
                </template>

            </el-table-column>
            <el-table-column prop="orderDate" label="转账日期" width="120">
            </el-table-column>
            <el-table-column prop="changeNum" label="单据编号" width="120">
            </el-table-column>
            <el-table-column label="转出账户" width="120">
                <template slot-scope="scope">
                    <table>
                        <tr v-for="(detail, index) in scope.row.detailList" :key="index">
                            <td>{{ detail.outName }}</td>
                        </tr>
                    </table>
                </template>
            </el-table-column>
            <el-table-column prop="zip" label="转入账户" width="120">
                <template slot-scope="scope">
                    <table>
                        <tr v-for="(detail, index) in scope.row.detailList" :key="index">
                            <td>{{ detail.inName }}</td>
                        </tr>
                    </table>
                </template>
            </el-table-column>
            <el-table-column prop="money" label="金额" width="120">
                <template slot-scope="scope">
                    <table>
                        <tr v-for="(detail, index) in scope.row.detailList" :key="index">
                            <td>{{ detail.money }}</td>
                        </tr>
                    </table>
                </template>
            </el-table-column>
            <el-table-column prop="zip" label="合计金额" width="120">

            </el-table-column>
            <el-table-column prop="doId" label="制单人" width="120">
            </el-table-column>
            <el-table-column prop="checkId" label="审核人" width="120">
            </el-table-column>
            <el-table-column prop="remark" label="备注" width="120">
            </el-table-column>
        </el-table>
        <div style="width: 100%;background-color: blanchedalmond;height: 30px;">
            <table style="width: 78.7%;height: 30px;">
                <tr>
                    <td style="width: 50%;">合计：</td>
                    <td style="width: 50%;">123</td>
                </tr>
            </table>
        </div>

    </div>

</template>

<script>
import Top from './Top.vue';

export default {
    name: "WriteOff",
    components:
    {
        Top
    },
    data() {
        return {
            changeNum: "",
            accountInId: "",
            accountOutId: "",
            dialogFormVisible: false,
            choose: false,
            choose1: false,
            path: "",
            accounts: "",
            pageInfo: "",
            pickerOptions: {
                disabledDate(time) {
                    return time.getTime() > Date.now();
                },
                shortcuts: [{
                    text: '今天',
                    onClick(picker) {
                        picker.$emit('pick', new Date());
                    }
                }, {
                    text: '昨天',
                    onClick(picker) {
                        const date = new Date();
                        date.setTime(date.getTime() - 3600 * 1000 * 24);
                        picker.$emit('pick', date);
                    }
                }, {
                    text: '一周前',
                    onClick(picker) {
                        const date = new Date();
                        date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', date);
                    }
                }]
            },

            props: {
                label: 'name',
                children: 'zones'
            },
            count: 1,
            value1: '',
            value2: '',
        };
    },
    methods: {
        handleClick: function (id) {
            if (confirm("是否删除")) {
                axios({
                    url: "/cash/change/delete",
                    params: {
                        id: id
                    }
                }).then(rs => {
                    console.log(rs)
                    if (rs.data.code === 200) {
                        alert("删除成功")
                        this.searchPage(1, 5)
                    } else {
                        alert("删除失败")
                    }
                })
            }
        },
        updateType: function (id) {
            this.$router.push({ name: 'CashChangeU', query: { id: id } });
        },
        searchByPage: function (pageNum, pageSize) {
            this.axios({
                url: "/cash/change/changeByPage",
                params: {
                    pageNum: pageNum,
                    pageSize: pageSize,
                    accountInId: this.accountInId,
                    accountOutId: this.accountOutId,
                    changeNum: this.changeNum
                }
            }).then(rs => {
                console.log(rs)
                this.pageInfo = rs.data.pageInfo
            })
        },
        getAccounts: function () {
            this.axios({
                url: "/info/account/selectAll",
                params: {

                }
            }).then(rs => {
                console.log(rs)
                this.accounts = rs.data.accounts
            })
        },
        goto() {

            this.$router.push(this.path)
        },
        handleCheckChange(data, checked, indeterminate) {
            console.log(data, checked, indeterminate);
        },
        handleNodeClick(data) {
            console.log(data);
        },
        loadNode(node, resolve) {
            if (node.level === 0) {
                return resolve([{ name: 'region1' }, { name: 'region2' }]);
            }
            if (node.level > 3) return resolve([]);

            var hasChild;
            if (node.data.name === 'region1') {
                hasChild = true;
            } else if (node.data.name === 'region2') {
                hasChild = false;
            } else {
                hasChild = Math.random() > 0.5;
            }

            setTimeout(() => {
                var data;
                if (hasChild) {
                    data = [{
                        name: 'zone' + this.count++
                    }, {
                        name: 'zone' + this.count++
                    }];
                } else {
                    data = [];
                }

                resolve(data);
            }, 500);
        }
    },
    created: function () {
        this.getAccounts()
        this.searchByPage(1, 5)
    }

}
</script>

<style>
tr {
    border: 1px solid black;
}
=======
<template>
    <div>
        <el-input style="width: 150px;margin-left: 0px;margin-right: 20px;" placeholder="请输入单据编号或备注" v-model="input"
            clearable>
        </el-input>
        <span class="demonstration">日期：</span>
        <el-date-picker v-model="value2" type="daterange" align="right" unlink-panels range-separator="至"
            start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions"
            style="width: 200px;margin-right: 20px;">
        </el-date-picker>

        付款账户：
        <el-select v-model="value" placeholder="付款账户" style="width: 100px;margin-right: 20px;">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
        </el-select>
        收款账户：
        <el-select v-model="value" placeholder="收款账户" style="width: 100px;margin-right: 20px;">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
        </el-select>
        <el-button type="" style="margin-left: 20px;float: right;">查询</el-button>
        <div style="clear: both;"></div>


        <hr style="margin-top: 10px">

        <div style="float: right;clear: both;margin-top: 10px">
            <el-button type="primary">新增</el-button>
            <el-button type="primary">审核</el-button>
            <el-button type="primary">导出</el-button>
            <el-button type="primary">删除</el-button>
        </div>
        <br>
        <div style="clear: both;"></div>
        <el-table height="300px" :data="tableData" border style="width: 100%; font-size: 13px;margin-top: 10px;">
            <el-table-column type="selection" width="55">
            </el-table-column>
            <el-table-column fixed prop="date" label="操作" width="150">

            </el-table-column>
            <el-table-column prop="name" label="转账日期" width="120">
            </el-table-column>
            <el-table-column prop="date" label="单据编号" width="120">
            </el-table-column>
            <el-table-column prop="address" label="转出账户" width="120">
            </el-table-column>
            <el-table-column prop="zip" label="转入账户" width="120">
            </el-table-column>
            <el-table-column prop="zip" label="金额" width="120">
            </el-table-column>
            <el-table-column prop="zip" label="合计金额" width="120">
            </el-table-column>
            <el-table-column prop="city" label="制单人" width="120">
            </el-table-column>
            <el-table-column prop="city" label="审核人" width="120">
            </el-table-column>
            <el-table-column prop="city" label="备注" width="120">
            </el-table-column>
        </el-table>
        <div style="width: 100%;background-color: blanchedalmond;height: 30px;">
            <table style="width: 78.7%;height: 30px;">
                <tr>
                    <td style="width: 50%;">合计：</td>
                    <td style="width: 50%;">123</td>
                </tr>
            </table>
        </div>

    </div>

</template>

<script>
import Top from './Top.vue';

export default {
    name: "WriteOff",
    components:
    {
        Top
    },
    data() {
        return {
            dialogFormVisible: false,
            choose: false,
            choose1: false,
            path: "",
            options: [{
                value: '选项1',
                label: '黄金糕'
            }, {
                value: '选项2',
                label: '双皮奶'
            }, {
                value: '选项3',
                label: '蚵仔煎'
            }, {
                value: '选项4',
                label: '龙须面'
            }, {
                value: '选项5',
                label: '北京烤鸭'
            }],
            gridData: [{
                date: '2016-05-02',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }, {
                date: '2016-05-04',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }, {
                date: '2016-05-01',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }, {
                date: '2016-05-03',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }],
            pickerOptions: {
                disabledDate(time) {
                    return time.getTime() > Date.now();
                },
                shortcuts: [{
                    text: '今天',
                    onClick(picker) {
                        picker.$emit('pick', new Date());
                    }
                }, {
                    text: '昨天',
                    onClick(picker) {
                        const date = new Date();
                        date.setTime(date.getTime() - 3600 * 1000 * 24);
                        picker.$emit('pick', date);
                    }
                }, {
                    text: '一周前',
                    onClick(picker) {
                        const date = new Date();
                        date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', date);
                    }
                }]
            },
            tableData: [{
                date: '2016-05-02',
                name: '王小虎',
                province: '上海',
                city: '普陀区',
                address: '上海市普陀区金沙江路 1518 弄',
                zip: '200333'
            }, {
                date: '2016-05-04',
                name: '王小虎',
                province: '上海',
                city: '普陀区',
                address: '上海市普陀区金沙江路 1517 弄',
                zip: '200333'
            }, {
                date: '2016-05-01',
                name: '王小虎',
                province: '上海',
                city: '普陀区',
                address: '上海市普陀区金沙江路 1519 弄',
                zip: '200333'
            }, {
                date: '2016-05-03',
                name: '王小虎',
                province: '上海',
                city: '普陀区',
                address: '上海市普陀区金沙江路 1516 弄',
                zip: '200333'
            }],
            props: {
                label: 'name',
                children: 'zones'
            },
            count: 1,
            value1: '',
            value2: '',
        };
    },
    methods: {
        goto() {

            this.$router.push(this.path)
        },
        handleCheckChange(data, checked, indeterminate) {
            console.log(data, checked, indeterminate);
        },
        handleNodeClick(data) {
            console.log(data);
        },
        loadNode(node, resolve) {
            if (node.level === 0) {
                return resolve([{ name: 'region1' }, { name: 'region2' }]);
            }
            if (node.level > 3) return resolve([]);

            var hasChild;
            if (node.data.name === 'region1') {
                hasChild = true;
            } else if (node.data.name === 'region2') {
                hasChild = false;
            } else {
                hasChild = Math.random() > 0.5;
            }

            setTimeout(() => {
                var data;
                if (hasChild) {
                    data = [{
                        name: 'zone' + this.count++
                    }, {
                        name: 'zone' + this.count++
                    }];
                } else {
                    data = [];
                }

                resolve(data);
            }, 500);
        }
    }

}
</script>

<style>
tr {
    border: 1px solid black;
}
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
</style>